<style lang="less" scoped>
.clientOrderGoodsTotal {
  margin-right: 0.5vw;
  padding: 0 15px;
  background-color: white;
  height: 95vh;
  position: relative;
}
.od-top {
  padding: 1.5vh 0;
  border-bottom: 2px solid #f4f4f4;
}
.od-top1 p:first-child {
  margin: 3px 6px 0 0;
  display: inline-block;
  white-space: nowrap;
}
.od-top1 p:not(:first-child) {
  margin: 3px 6px 0 12px;
  display: inline-block;
  white-space: nowrap;
}
.od-top1 {
  display: flex;
}
.od-top2 {
  margin-top: 1.5vh;
  display: flex;
}
.od-top2 p {
  margin: 3px 6px 0 0;
}
.od-btn {
  padding: 1.5vh 0;
  display: flex;
  justify-content: space-between;
}
.od-tab {
  display: flex;
}
.tab-left {
  width: 71%;
  padding-right: 10px;
  border-right: 2px solid #f4f4f4;
}
.tab-right {
  padding: 0 10px;
  /* width: 30%; */
}
.footView span {
  float: left;
  margin-right: 48px;
  line-height: 6vh;
  font-size: 14px;
}

#imgBox {
  margin-top: 15px;
  height: 460px;
  text-align: center;
  width: fit-content;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
#imgBox .imgTop {
  background-color: #f4f4f4;
  height: 30px;
  line-height: 30px;
  font-weight: bold;
}
#imgBox .imgTop span {
  color: #017aff;
}
#imgBox img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}
</style>

<style>
.clientOrderGoodsTotal .od-top1 .el-input__inner,
.clientOrderGoodsTotal .od-top1 .el-input {
  height: 30px;
  width: 8vw;
}
.clientOrderGoodsTotal .od-top .od-top1 .el-input {
  width: 8vw;
}
.clientOrderGoodsTotal .od-top .od-top2 .el-input__inner {
  width: 18.6vw;
  height: 30px;
}
.clientOrderGoodsTotal .el-select .el-input__icon {
  line-height: 30px;
}
.clientOrderGoodsTotal .el-date-editor .el-range__icon,
.clientOrderGoodsTotal .el-date-editor .el-range-separator {
  line-height: 24px;
}

.clientOrderGoodsTotal .tab-right .el-table .cell {
  padding: 0;
}

.clientOrderGoodsTotal .el-table .cell {
  padding: 0;
}
.clientOrderGoodsTotal .el-table__footer td {
  height: 26px;
}
</style>

<template>
  <div class="clientOrderGoodsTotal">
    <div class="od-top">
      <div class="od-top1">
        <p>客户</p>
        <el-select :disabled="jxAgent" v-model="customerNo" clearable>
          <el-option
            v-for="item in customerList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
            <span style="float: left">{{ item.value }}</span>
            <span style="float: right">{{ item.label }}</span></el-option
          >
        </el-select>
        <p>款号</p>
        <el-input
          v-model="styleNumber"
          placeholder="多个款号以逗号隔开"
          @input="onInputStyleNumber"
        ></el-input>
        <!-- <el-select v-model="styleNumber" clearable multiple collapse-tags>
          <el-option
            v-for="item in styleNumberList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select> -->
        <p>未出量</p>
        <el-input v-model="notOutNumber">
          <template slot="prepend">>=</template></el-input
        >
        <p>季度</p>
        <el-select v-model="quarter">
          <el-option
            v-for="item in quarterList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
        <p>配货方式</p>
        <el-select v-model="cooperateWay">
          <el-option
            v-for="item in cooperateWayList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
        <p>大类</p>
        <el-select v-model="commodityType">
          <el-option
            v-for="item in commodityTypeList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
        <p>品牌</p>
        <el-select v-model="brandedName">
          <el-option
            v-for="item in brandList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="od-top2">
        <p>日期</p>
        <el-date-picker
          unlink-panels
          v-model="dateList"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
        ></el-date-picker>
      </div>
    </div>
    <div class="od-btn">
      <div>
        <el-button @click="search" icon="el-icon-search" type="primary"
          >查询</el-button
        >
        <el-button @click="exportTable" icon="el-icon-upload2">导出</el-button>
      </div>
      <div class="od-top1">
        <p>合计方式</p>
        <el-select v-model="summation">
          <el-option
            v-for="item in summationType"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
        <p>排序方式</p>
        <el-select v-model="sortType">
          <el-option
            v-for="item in sortTypeList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
    </div>
    <div class="od-tab">
      <div class="tab-left">
        <el-table
          ref="table1"
          border
          :data="tableData1"
          style="width: 100%"
          highlight-current-row
          show-summary
          :summary-method="getSummaries"
          :header-cell-style="{
            background: '#f4f4f4',
            padding: 0,
            height: '40px'
          }"
          :cell-style="changeCellStyle"
          height="70.5vh"
          @row-click="rowclick"
        >
          <template v-for="i in hList">
            <el-table-column
              :prop="i.prop"
              :label="i.label"
              :width="i.width"
              :key="i.prop"
              align="center"
              :sortable="i.isSort"
              show-overflow-tooltip
            ></el-table-column>
          </template>
        </el-table>
      </div>
      <div class="tab-right">
        <el-table
          border
          :data="tableData2"
          style="width: 100%"
          :header-cell-style="{
            background: '#f4f4f4',
            padding: 0,
            height: '40px'
          }"
          :cell-style="{ padding: 0, height: '36px' }"
        >
          <el-table-column
            prop="colorNo"
            label="色号"
            width="40"
          ></el-table-column>
          <el-table-column prop="c05" label="C05" width="34"></el-table-column>
          <el-table-column prop="c07" label="C07" width="34"></el-table-column>
          <el-table-column prop="c09" label="C09" width="34"></el-table-column>
          <el-table-column prop="c11" label="C11" width="34"></el-table-column>
          <el-table-column prop="c13" label="C13" width="34"></el-table-column>
          <el-table-column prop="c15" label="C15" width="34"></el-table-column>
          <el-table-column prop="c17" label="C17" width="34"></el-table-column>
          <el-table-column prop="c19" label="C19" width="34"></el-table-column>
          <el-table-column prop="c21" label="C21" width="34"></el-table-column>
          <el-table-column prop="c23" label="C23" width="34"></el-table-column>
          <el-table-column prop="f" label="F" width="34"></el-table-column>
          <el-table-column
            prop="total"
            label="总数量"
            width="60"
          ></el-table-column>
        </el-table>
        <div id="imgBox">
          <div class="imgTop">
            货号： <span>{{ selectKindsNumber }}</span
            >售价： <span>{{ selectSellingPrice }}</span>
          </div>
          <img :src="selectImage" ondragstart="return false;" />
        </div>
      </div>
    </div>
    <foot-view
      class="footView"
      :pagesNum="pagesNum"
      :hasPagination="true"
      :pageSize="limit"
      :tableTypeChange="tableTypeChange"
      @handleSizeChange="handleSizeChange"
      @handleCurrentChange="handleCurrentChange"
    >
      <div slot="text">
        <span>数据库：{{ jxQuarter }}</span>
        <span>如果要显示图片与库存，请双击左表记录</span>
        <!-- <span>ESC隐藏查询明细</span>
      <span>备注：如果删除了货号建档则可能有货号为空</span> -->
      </div>
    </foot-view>
  </div>
</template>

<script>
import {
  selectSum,
  selectByStyleColor
} from '../../../network/customerOrderTotal'
import { getClient } from '../../../network/client'
import { getBranded } from '../../../network/branded'
import { getCommodityType } from '../../../network/commodity'
import { getQuarter, getNumber } from '../../../network/quarter'

import footView from '../../../components/FootView'

import today from '../../../components/mixins/today'
import enterUp from '../../../components/mixins/enterUp'
import zero from '../../../components/mixins/zero2blank'

import table2excel from 'js-table2excel'

export default {
  name: 'client_order_goods_total',
  mixins: [today, enterUp, zero],
  created() {
    let jxQuarterVal = document.cookie.match(RegExp('jxQuarter' + '=([^;]+)'))
    let jxAgentVal = document.cookie.match(RegExp('jxAgent'+'=([^;]+)'))
    let operatorVal = document.cookie.match(RegExp('jxAgent'+'=([^;]+)'))
    this.jxQuarter = jxQuarterVal ? jxQuarterVal[1] : null
    this.operator = operatorVal ? operatorVal[1] : null
   if(jxAgentVal){
    this.jxAgent = jxAgentVal[1] == 1 ? true : false
   }
   
    this.inpList = this.getInput()
    this.hList = this.hList1

    // 默认选之前一周
    // this.dateList = [this.searchDate(7),this.searchDate()]

    // 获取所有客户信息
    getClient({ limit: 99999 }).then((res) => {
      if (res.data.code == 200) {
        let list = res.data.data
        list.forEach((e) => {
          if (e.stop != 1) {
            this.customerList.push({ value: e.no, label: e.name })
          }
        })
        if (this.jxAgent) {
          for (const i of this.customerList) {
            if (i.label == this.operator) {
              this.customerNo = i.value
              break
            }
          }
        }
      }
    })
    // 获取品牌
    getBranded().then((res) => {
      res.data.data.forEach((e) => {
        this.brandList.push({ value: e.name, label: e.name })
      })
    })
    // 获取部类
    getCommodityType({ limit: 99999 }).then((res) => {
      if (res.data.data.length) {
        res.data.data.forEach((e) => {
          this.commodityTypeList.push({ value: e.no, label: e.type })
        })
      }
    })
    // 获取季度
    getQuarter().then((res) => {
      if (res.data.code == 200) {
        res.data.data.forEach((e) => {
          this.quarterList.push({ value: e.id, label: e.name })
        })
      }
    })
    // 获取款号
    // getNumber(JSON.stringify([''])).then((res) => {
    //   if (res.data.code == 200) {
    //     res.data.data.forEach((e) => {
    //       this.styleNumberList.push({
    //         value: e.styleNumber,
    //         label: e.styleNumber
    //       })
    //     })
    //   }
    // })
  },
  data() {
    return {
      inpList: [],
      // 总数据条数
      dataLen: 0,
      // 总页码
      pagesNum: 0,
      // 分页条数
      limit: 20,
      // 当前页码
      currentPage: 1,
      tableTypeChange: false,

      selectStyleNumber: '',
      selectColorNo: '',
      selectKindsNumber: '',
      selectSellingPrice: '',
      selectImage: '',

      selectedCustomerNo: [],

      customerNo: '',
      customerList: [],
      // styleNumber: [],
      styleNumber: null,
      styleNumberList: [],
      notOutNumber: '',
      quarter: '',
      quarterList: [],
      cooperateWay: '配货',
      cooperateWayList: [
        { value: '配货', label: '配货' },
        { value: '订货', label: '订货' },
        { value: '订断', label: '订断' },
        { value: '追断', label: '追断' }
      ],
      commodityType: '',
      commodityTypeList: [],
      brandedName: '',
      brandList: [],
      dateList: null,

      summation: 1,
      summationType: [
        { value: 1, label: '不合计' },
        // {value:2,label:'货号合计'},
        { value: 3, label: '款号合计' },
        { value: 4, label: '款号-色号合计' },
        { value: 5, label: '客户合计' },
        { value: 6, label: '客户-款号合计' }
      ],
      sortType: '',
      sortTypeList: [
        { value: 1, label: '客户排序' },
        { value: 2, label: '货号排序' },
        { value: 3, label: '未出量排序' }
      ],

      hList: [],
      // 不合计，货号合计
      hList1: [
        { prop: 'styleNumber', label: '款号', width: '120', isSort: true },
        { prop: 'colorNo', label: '色号', width: '70' },
        { prop: 'colorName', label: '颜色', width: '70' },
        { prop: 'customerNo', label: '客户编号', width: '110', isSort: true },
        { prop: 'customerName', label: '客户简称', width: '100' },
        { prop: 'CuttingLine1', label: '', width: '5' },
        { prop: 'orderC05', label: 'C05订', width: '70' },
        { prop: 'orderC07', label: 'C07订', width: '70' },
        { prop: 'orderC09', label: 'C09订', width: '70' },
        { prop: 'orderC11', label: 'C11订', width: '70' },
        { prop: 'orderC13', label: 'C13订', width: '70' },
        { prop: 'orderC15', label: 'C15订', width: '70' },
        { prop: 'orderC17', label: 'C17订', width: '70' },
        { prop: 'orderC19', label: 'C19订', width: '70' },
        { prop: 'orderC21', label: 'C21订', width: '70' },
        { prop: 'orderC23', label: 'C23订', width: '70' },
        { prop: 'orderF', label: 'F订', width: '70' },
        { prop: 'CuttingLine2', label: '', width: '5' },
        { prop: 'inputC05', label: 'C05进', width: '70' },
        { prop: 'inputC07', label: 'C07进', width: '70' },
        { prop: 'inputC09', label: 'C09进', width: '70' },
        { prop: 'inputC11', label: 'C11进', width: '70' },
        { prop: 'inputC13', label: 'C13进', width: '70' },
        { prop: 'inputC15', label: 'C15进', width: '70' },
        { prop: 'inputC17', label: 'C17进', width: '70' },
        { prop: 'inputC19', label: 'C19进', width: '70' },
        { prop: 'inputC21', label: 'C21进', width: '70' },
        { prop: 'inputC23', label: 'C23进', width: '70' },
        { prop: 'inputF', label: 'F进', width: '70' },
        { prop: 'CuttingLine3', label: '', width: '5' },
        { prop: 'differenceC05', label: 'C05差', width: '70' },
        { prop: 'differenceC07', label: 'C07差', width: '70' },
        { prop: 'differenceC09', label: 'C09差', width: '70' },
        { prop: 'differenceC11', label: 'C11差', width: '70' },
        { prop: 'differenceC13', label: 'C13差', width: '70' },
        { prop: 'differenceC15', label: 'C15差', width: '70' },
        { prop: 'differenceC17', label: 'C17差', width: '70' },
        { prop: 'differenceC19', label: 'C19差', width: '70' },
        { prop: 'differenceC21', label: 'C21差', width: '70' },
        { prop: 'differenceC23', label: 'C23差', width: '70' },
        { prop: 'differenceF', label: 'F差', width: '70' }
      ],
      // 款号合计
      hList2: [
        { prop: 'styleNumber', label: '款号', width: '' },
        { prop: 'orderTotalNumber', label: '订货', width: '' },
        { prop: 'inputTotalNumber', label: '进货', width: '' },
        {
          prop: 'differenceTotalNumber',
          label: '未交',
          width: '',
          isSort: true
        }
      ],
      // 款号-色号合计
      hList3: [
        { prop: 'styleNumber', label: '款号', width: '' },
        { prop: 'colorNo', label: '色号', width: '' },
        { prop: 'colorName', label: '颜色', width: '' },
        { prop: 'orderTotalNumber', label: '订货', width: '' },
        { prop: 'inputTotalNumber', label: '进货', width: '' },
        {
          prop: 'differenceTotalNumber',
          label: '未交',
          width: '',
          isSort: true
        }
      ],
      // 客户合计
      hList4: [
        { prop: 'customerNo', label: '客户编号', width: '', isSort: true },
        { prop: 'customerName', label: '客户简称', width: '' },
        { prop: 'orderTotalNumber', label: '订货', width: '' },
        { prop: 'inputTotalNumber', label: '进货', width: '' },
        {
          prop: 'differenceTotalNumber',
          label: '未交',
          width: '',
          isSort: true
        }
      ],
      // 客户-款号合计
      hList5: [
        { prop: 'customerNo', label: '客户编号', width: '', isSort: true },
        { prop: 'customerName', label: '客户简称', width: '' },
        { prop: 'styleNumber', label: '款号', width: '' },
        { prop: 'orderTotalNumber', label: '订货', width: '' },
        { prop: 'inputTotalNumber', label: '进货', width: '' },
        {
          prop: 'differenceTotalNumber',
          label: '未交',
          width: '',
          isSort: true
        }
      ],

      tableData1: [],
      tableData2: [],
      // 不合计
      customerOrderNotTotal: [],
      // 客户合计
      customerTotal: [],
      // 客户款号合计
      customerStyleTotal: [],
      // 款号合计
      styleTotal: [],
      // 货号合计
      kindsTotal: [],
      // 款号色号合计
      styleColorTotal: [],

      // 设置表头
      selectHeaderList: [],
      headerList: [],
      jxQuarter: null,
      jxAgent:null,
      operator:null,
      // jxQuarter: document.cookie.match(RegExp('jxQuarter' + '=([^;]+)'))[1],
      // jxAgent:
      //   document.cookie.match(RegExp('jxAgent' + '=([^;]+)'))[1] == 1
      //     ? true
      //     : false,
      // operator: document.cookie.match(RegExp('jxUser' + '=([^;]+)'))[1],

      summationObj: {},
      sumList: [
        'orderC05',
        'orderC07',
        'orderC09',
        'orderC11',
        'orderC13',
        'orderC15',
        'orderC17',
        'orderC19',
        'orderC21',
        'orderC23',
        'orderF',
        'inputC05',
        'inputC07',
        'inputC09',
        'inputC11',
        'inputC13',
        'inputC15',
        'inputC17',
        'inputC19',
        'inputC21',
        'inputC23',
        'inputF',
        'differenceC05',
        'differenceC07',
        'differenceC09',
        'differenceC11',
        'differenceC13',
        'differenceC15',
        'differenceC17',
        'differenceC19',
        'differenceC21',
        'differenceC23',
        'differenceF',
        'orderTotalNumber',
        'inputTotalNumber',
        'differenceTotalNumber'
      ]
    }
  },
  watch: {
    summation(a, b) {
      this.currentPage = 1
      this.tableTypeChange = !this.tableTypeChange

      switch (a) {
        case 1:
          this.hList = this.hList1
          // this.dataLen = this.customerOrderNotTotal.length
          // this.tableData1 = this.customerOrderNotTotal.slice(0,this.limit)
          break
        case 2:
          this.hList = this.hList1
          // this.dataLen = this.kindsTotal.length
          // this.tableData1 = this.kindsTotal.slice(0,this.limit)
          break
        case 3:
          this.hList = this.hList2
          // this.dataLen = this.styleTotal.length
          // this.tableData1 = this.styleTotal.slice(0,this.limit)
          break
        case 4:
          this.hList = this.hList3
          // this.dataLen = this.styleTotal.length
          // this.tableData1 = this.styleColorTotal.slice(0,this.limit)
          break
        case 5:
          this.hList = this.hList4
          // this.dataLen = this.customerTotal.length
          // this.tableData1 = this.customerTotal.slice(0,this.limit)
          break
        case 6:
          this.hList = this.hList5
          // this.dataLen = this.customerStyleTotal.length
          // this.tableData1 = this.customerStyleTotal.slice(0,this.limit)
          break
      }
      this.changeShow()
    },
    sortType(a, b) {
      switch (a) {
        case 1:
          this.customerOrderNotTotal.sort((a, b) => {
            return a.customerNo.localeCompare(b.customerNo)
          })
          this.customerTotal.sort((a, b) => {
            return a.customerNo.localeCompare(b.customerNo)
          })
          // this.kindsTotal.sort((a,b) => {
          //   return a.customerNo.localeCompare(b.customerNo)
          // })
          this.customerStyleTotal.sort((a, b) => {
            return a.customerNo.localeCompare(b.customerNo)
          })
          break
        case 2:
          this.customerOrderNotTotal.sort((a, b) => {
            return a.kindsNumber.localeCompare(b.kindsNumber)
          })
          // this.kindsTotal.sort((a,b) => {
          //   return a.kindsNumber.localeCompare(b.kindsNumber)
          // })
          break
        case 3:
          this.customerTotal.sort((a, b) => {
            return a.differenceTotalNumber - b.differenceTotalNumber
          })
          this.customerStyleTotal.sort((a, b) => {
            return a.differenceTotalNumber - b.differenceTotalNumber
          })
          this.styleTotal.sort((a, b) => {
            return a.differenceTotalNumber - b.differenceTotalNumber
          })
          // this.kindsTotal.sort((a,b) => {
          //   return a.differenceTotalNumber - b.differenceTotalNumber
          // })
          break
      }
      this.changeShow()
    },
    dataLen(a, b) {
      this.pagesNum = Math.ceil(this.dataLen / this.limit)
    },
    limit(a, b) {
      this.pagesNum = Math.ceil(this.dataLen / this.limit)
    }
  },
  methods: {
    onInputStyleNumber(value) {
      this.styleNumber = value.toUpperCase()
    },
    search() {
      this.selectedCustomerNo = []
      // let sn = ''
      // if (this.styleNumber.length) {
      //   for (const e of this.styleNumber) {
      //     if (sn == '') {
      //       sn = `'${e}'`
      //       continue
      //     }
      //     sn = `${sn},'${e}'`
      //   }
      // }
      // console.log('sn', sn)
      let quarterName = ''
      for (const i of this.quarterList) {
        if (i.value == this.quarter) {
          quarterName = i.label
          break
        }
      }

      // let arr = this.styleNumber.split(',')
      // console.log('arr10', arr)
      // const a11 = arr.map(function (item) {
      //   return "'" + String(item) + "'"
      // })
      // console.log('arr', arr)
      // console.log('a11', a11)
      // console.log(
      //   'ok',
      //   // map是有返回值的，map改变数组的时候，能返回一个改变之后的数组
      //   this.styleNumber
      //     .split(',')
      //     .map(function (item) {
      //       return "'" + String(item) + "'"
      //     })
      //     // .join(',')
      // )
      // return
      // 下面这个方法，就是应该要传参，参数要变成这个样式'QWERT','ASDFG'，才用的
      function combine_ids(array) {
        var tmp = []
        for (var i = 0; i < array.length; i++) {
          tmp[i] = "'" + String(array[i]) + "'"
        }
        return tmp.join(',')
      }
      //  ----------------------
      // console.log(combine_ids(this.styleNumber.split(',')))
      // return
      selectSum({
        customerNo: this.customerNo,
        // styleNumber: sn,
        // styleNumber: this.styleNumber,
        styleNumber: this.styleNumber
          ? combine_ids(this.styleNumber.split(','))
          : '',
        // styleNumber: this.styleNumber
        //   ? JSON.stringify(
        //       this.styleNumber.split(',').toString().replace(/\"|"/g, '')
        //     )
        //   : '',
        notOutNumber: this.notOutNumber,
        quarter: this.quarter,
        quarterName,
        cooperateWay: this.cooperateWay,
        commodityType: this.commodityType,
        brandedName: this.brandedName,
        startTime:
          this.dateList == null || this.dateList == ''
            ? ''
            : this.dateList[0] + ' 00:00:00',
        endTime:
          this.dateList == null || this.dateList == ''
            ? ''
            : this.dateList[1] + ' 23:59:59'
      }).then((res) => {
        this.summation = 1
        this.sortType = 1
        this.dataLen = 0

        this.customerOrderNotTotal = []
        this.customerTotal = []
        this.customerStyleTotal = []
        this.styleTotal = []
        this.kindsTotal = []
        this.tableData1 = []
        this.tableData2 = []

        this.selectStyleNumber = ''
        this.selectColorNo = ''
        this.selectKindsNumber = ''
        this.selectSellingPrice = 0
        this.selectImage = require('../../../assets/img/no-data.png')

        if (res.data.code == 200) {
          this.currentPage = 1
          this.tableTypeChange = !this.tableTypeChange

          // 不合计
          this.customerOrderNotTotal = res.data.data.customerOrderNotTotal || []
          // 客户合计
          this.customerTotal = res.data.data.customerTotal || []
          // 客户款号合计
          this.customerStyleTotal = res.data.data.customerStyleTotal || []
          // 款号合计
          this.styleTotal = res.data.data.styleTotal || []
          // 货号合计
          this.kindsTotal = res.data.data.kindsTotal || []
          // 款号色号合计
          this.styleColorTotal = res.data.data.styleColorTotal || []

          // this.selectStyleNumber = this.customerOrderNotTotal[0].styleNumber
          this.selectColorNo = this.customerOrderNotTotal[0].colorNo
          this.selectKindsNumber = this.customerOrderNotTotal[0].kindsNumber
          this.selectSellingPrice = this.customerOrderNotTotal[0].sellingPrice
          this.selectImage =
            this.customerOrderNotTotal[0].image ||
            require('../../../assets/img/no-data.png')
          this.switchRight()

          // this.summation = 1
          // this.sortType = 1
          // this.dataLen = this.customerOrderNotTotal.length
          // this.tableData1 = this.customerOrderNotTotal.slice(0,this.limit)

          this.sum()

          this.zero2blank(this.customerOrderNotTotal)
          this.zero2blank(this.customerTotal)
          this.zero2blank(this.customerStyleTotal)
          this.zero2blank(this.styleTotal)
          this.zero2blank(this.kindsTotal)
          this.zero2blank(this.styleColorTotal)

          this.currentPage = 1
          this.tableTypeChange = !this.tableTypeChange
          this.changeShow()

          this.$nextTick(() => {
            this.$refs.table1.doLayout()
          })
        }
      })
    },
    exportTable() {
      let column = []
      switch (this.summation) {
        case 1:
          column = [
            { key: 'kindsNumber', title: '货号', type: 'text' },
            { key: 'colorNo', title: '色号', type: 'text' },
            { key: 'colorName', title: '颜色', type: 'text' },
            { key: 'customerNo', title: '客户编号', type: 'text' },
            { key: 'customerName', title: '客户简称', type: 'text' },
            { key: 'orderC05', title: 'C05订', type: 'text' },
            { key: 'orderC07', title: 'C07订', type: 'text' },
            { key: 'orderC09', title: 'C09订', type: 'text' },
            { key: 'orderC11', title: 'C11订', type: 'text' },
            { key: 'orderC13', title: 'C13订', type: 'text' },
            { key: 'orderC15', title: 'C15订', type: 'text' },
            { key: 'orderC17', title: 'C17订', type: 'text' },
            { key: 'orderC19', title: 'C19订', type: 'text' },
            { key: 'orderC21', title: 'C21订', type: 'text' },
            { key: 'orderC23', title: 'C23订', type: 'text' },
            { key: 'orderF', title: 'F订', type: 'text' },
            { key: 'inputC05', title: 'C05进', type: 'text' },
            { key: 'inputC07', title: 'C07进', type: 'text' },
            { key: 'inputC09', title: 'C09进', type: 'text' },
            { key: 'inputC11', title: 'C11进', type: 'text' },
            { key: 'inputC13', title: 'C13进', type: 'text' },
            { key: 'inputC15', title: 'C15进', type: 'text' },
            { key: 'inputC17', title: 'C17进', type: 'text' },
            { key: 'inputC19', title: 'C19进', type: 'text' },
            { key: 'inputC21', title: 'C21进', type: 'text' },
            { key: 'inputC23', title: 'C23进', type: 'text' },
            { key: 'inputF', title: 'F进', type: 'text' },
            { key: 'differenceC05', title: 'C05差', type: 'text' },
            { key: 'differenceC07', title: 'C07差', type: 'text' },
            { key: 'differenceC09', title: 'C09差', type: 'text' },
            { key: 'differenceC11', title: 'C11差', type: 'text' },
            { key: 'differenceC13', title: 'C13差', type: 'text' },
            { key: 'differenceC15', title: 'C15差', type: 'text' },
            { key: 'differenceC17', title: 'C17差', type: 'text' },
            { key: 'differenceC19', title: 'C19差', type: 'text' },
            { key: 'differenceC21', title: 'C21差', type: 'text' },
            { key: 'differenceC23', title: 'C23差', type: 'text' },
            { key: 'differenceF', title: 'F差', type: 'text' }
          ]
          table2excel(
            column,
            this.customerOrderNotTotal,
            '客户订货合计不合计.xls'
          )
          break
        case 2:
          column = [
            { key: 'kindsNumber', title: '货号', type: 'text' },
            { key: 'colorNo', title: '色号', type: 'text' },
            { key: 'colorName', title: '颜色', type: 'text' },
            { key: 'customerNo', title: '客户编号', type: 'text' },
            { key: 'customerName', title: '客户简称', type: 'text' },
            { key: 'orderC05', title: 'C05订', type: 'text' },
            { key: 'orderC07', title: 'C07订', type: 'text' },
            { key: 'orderC09', title: 'C09订', type: 'text' },
            { key: 'orderC11', title: 'C11订', type: 'text' },
            { key: 'orderC13', title: 'C13订', type: 'text' },
            { key: 'orderC15', title: 'C15订', type: 'text' },
            { key: 'orderC17', title: 'C17订', type: 'text' },
            { key: 'orderC19', title: 'C19订', type: 'text' },
            { key: 'orderC21', title: 'C21订', type: 'text' },
            { key: 'orderC23', title: 'C23订', type: 'text' },
            { key: 'orderF', title: 'F订', type: 'text' },
            { key: 'inputC05', title: 'C05进', type: 'text' },
            { key: 'inputC07', title: 'C07进', type: 'text' },
            { key: 'inputC09', title: 'C09进', type: 'text' },
            { key: 'inputC11', title: 'C11进', type: 'text' },
            { key: 'inputC13', title: 'C13进', type: 'text' },
            { key: 'inputC15', title: 'C15进', type: 'text' },
            { key: 'inputC17', title: 'C17进', type: 'text' },
            { key: 'inputC19', title: 'C19进', type: 'text' },
            { key: 'inputC21', title: 'C21进', type: 'text' },
            { key: 'inputC23', title: 'C23进', type: 'text' },
            { key: 'inputF', title: 'F进', type: 'text' },
            { key: 'differenceC05', title: 'C05差', type: 'text' },
            { key: 'differenceC07', title: 'C07差', type: 'text' },
            { key: 'differenceC09', title: 'C09差', type: 'text' },
            { key: 'differenceC11', title: 'C11差', type: 'text' },
            { key: 'differenceC13', title: 'C13差', type: 'text' },
            { key: 'differenceC15', title: 'C15差', type: 'text' },
            { key: 'differenceC17', title: 'C17差', type: 'text' },
            { key: 'differenceC19', title: 'C19差', type: 'text' },
            { key: 'differenceC21', title: 'C21差', type: 'text' },
            { key: 'differenceC23', title: 'C23差', type: 'text' },
            { key: 'differenceF', title: 'F差', type: 'text' }
          ]
          table2excel(column, this.kindsTotal, '客户订货合计货号合计.xls')
          break
        case 3:
          column = [
            { key: 'styleNumber', title: '款号', type: 'text' },
            { key: 'orderTotalNumber', title: '订货', type: 'text' },
            { key: 'inputTotalNumber', title: '进货', type: 'text' },
            { key: 'differenceTotalNumber', title: '未交', type: 'text' }
          ]
          table2excel(column, this.styleTotal, '客户订货合计款号合计.xls')
          break
        case 4:
          column = [
            { key: 'styleNumber', title: '款号', type: 'text' },
            { key: 'colorNo', title: '色号', type: 'text' },
            { key: 'colorName', title: '颜色', type: 'text' },
            { key: 'orderTotalNumber', title: '订货', type: 'text' },
            { key: 'inputTotalNumber', title: '进货', type: 'text' },
            { key: 'differenceTotalNumber', title: '未交', type: 'text' }
          ]
          table2excel(column, this.styleTotal, '客户订货合计款号-色号合计.xls')
          break
        case 5:
          column = [
            { key: 'customerNo', title: '客户编号', type: 'text' },
            { key: 'customerName', title: '客户简称', type: 'text' },
            { key: 'orderTotalNumber', title: '订货', type: 'text' },
            { key: 'inputTotalNumber', title: '进货', type: 'text' },
            { key: 'differenceTotalNumber', title: '未交', type: 'text' }
          ]
          table2excel(column, this.customerTotal, '客户订货合计客户合计.xls')
          break
        case 6:
          column = [
            { key: 'customerNo', title: '客户编号', type: 'text' },
            { key: 'customerName', title: '客户简称', type: 'text' },
            { key: 'styleNumber', title: '款号', type: 'text' },
            { key: 'orderTotalNumber', title: '订货', type: 'text' },
            { key: 'inputTotalNumber', title: '进货', type: 'text' },
            { key: 'differenceTotalNumber', title: '未交', type: 'text' }
          ]
          table2excel(
            column,
            this.customerStyleTotal,
            '客户订货合计客户-款号合计.xls'
          )
          break
      }
    },
    // 表格中淡蓝色的样式
    changeCellStyle({ row, column, rowIndex, columnIndex }) {
      if (this.summation == 1) {
        // 不合计
        if (columnIndex == 5 || columnIndex == 17 || columnIndex == 29) {
          return 'background-color:#D5EAFF;padding:0;height:30px;'
        } else if (columnIndex == 2) {
          // if (this.selectedCustomerNo.indexOf(row.customerNo) != -1) {
          //   return 'background-color:#D5EAFF;padding:0;height:30px;'
          // }
        }
      }
      return 'padding:0;height:30px;'
    },
    rowclick(row, column, event) {
      console.log(row)
      // console.log(column)
      // console.log(event)
      if (this.selectedCustomerNo.indexOf(row.customerNo) == -1) {
        this.selectedCustomerNo.push(row.customerNo)
      }
      if (this.summation != 1 && this.summation != 4) return
      if (
        row.styleNumber != this.selectStyleNumber ||
        row.colorNo != this.selectColorNo
      ) {
        this.selectStyleNumber = row.styleNumber
        this.selectColorNo = row.colorNo
        this.selectKindsNumber = row.kindsNumber
        this.selectSellingPrice = row.sellingPrice
        this.selectImage =
          row.image || require('../../../assets/img/no-data.png')
        this.switchRight()
      }
    },

    switchRight() {
      selectByStyleColor({
        colorNo: this.selectColorNo,
        styleNumber: this.selectStyleNumber
      }).then((res) => {
        // console.log('1111', res)
        // fei添加
        if (res.data.code === 200 && !res.data.data) return
        // console.log(111)
        if (res.data.code == 200) {
          this.tableData2 = [res.data.data]
          this.tableData2.forEach((e) => {
            e.total =
              e.c05 +
              e.c07 +
              e.c09 +
              e.c11 +
              e.c13 +
              e.c15 +
              e.c17 +
              e.c19 +
              e.c21 +
              e.c23 +
              e.f
          })
        }
      })
    },

    // 每页显示页数改变
    handleSizeChange(val) {
      this.limit = val
      this.currentPage = 1
      this.tableTypeChange = !this.tableTypeChange
      this.changeShow()
    },
    // 当前页改变
    handleCurrentChange(val) {
      this.currentPage = val
      this.changeShow()
    },
    changeShow() {
      switch (this.summation) {
        case 1:
          this.dataLen = this.customerOrderNotTotal.length
          this.tableData1 = this.customerOrderNotTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
        case 2:
          this.dataLen = this.kindsTotal.length
          this.tableData1 = this.kindsTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
        case 3:
          this.dataLen = this.styleTotal.length
          this.tableData1 = this.styleTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
        case 4:
          this.dataLen = this.styleTotal.length
          this.tableData1 = this.styleTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
        case 5:
          this.dataLen = this.customerTotal.length
          this.tableData1 = this.customerTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
        case 6:
          this.dataLen = this.customerStyleTotal.length
          this.tableData1 = this.customerStyleTotal.slice(
            (this.currentPage - 1) * this.limit,
            this.currentPage * this.limit
          )
          break
      }
      this.$nextTick(() => {
        this.$refs.table1.doLayout()
      })
      this.$forceUpdate()
    },

    getSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        const prop = column.property
        if (this.sumList.includes(prop)) {
          sums[index] = this.summationObj[prop] || ''
        }
        let decimal = sums[index] ? sums[index].toString().split('.')[1] : ''
        if (decimal && decimal.length > 2) {
          sums[index] = sums[index].toFixed(2)
        }
      })
      return sums
    },

    sum() {
      this.sumList.forEach((e) => {
        this.summationObj[e] = 0
      })
      this.customerOrderNotTotal.forEach((e) => {
        this.sumList.forEach((f) => {
          this.summationObj[f] += e[f]
        })
      })
    }
  },
  components: {
    footView
  }
}
</script>
